/**
 * @flow
 */

import React from 'react'
import RxPageCore from './RxPageCore'
import PPC from './RxPageConfig'
import RxNavBar from './bar/RxNavBar'
import {useNavigation} from '@react-navigation/native'

/**
 * 通用导航页 - 主要用于配置 [页面导航栏]
 * @param {*} props {children, style, title, isHiddenLeft, onLeftPress, isHiddenRight, rightView, rightText, onRightPress}
 */
const RxPage = props => {
  console.log('RxPage - props=', props)
  const p = props || {}
  // prettier-ignore
  let {
    children, style, title,
    hiddenNavBar,
    onLeftPress, isHiddenRight, rightView, rightText, onRightPress,
    ...other} = p

  let isHiddenLeft = true
  const n = useNavigation() || {}
  const cgb = n.canGoBack
  if (cgb && typeof cgb === 'function') {
    const canGoBack = cgb()
    // console.log('canGoBack=', canGoBack)
    isHiddenLeft = !canGoBack
  }

  const goBack = () => {
    // console.log('点击返回')
    const f = () => {}
    const g = n.goBack || f
    if (g && typeof g === 'function') {
      g()
    }
  }

  if (!onLeftPress) {
    onLeftPress = goBack
  }

  const navBar = () => {
    if (hiddenNavBar) {
      return null
    }
    return (
      <RxNavBar
        title={title}
        isHiddenLeft={isHiddenLeft}
        onLeftPress={onLeftPress}
        isHiddenRight={isHiddenRight}
        rightView={rightView}
        rightText={rightText}
        onRightPress={onRightPress}
      />
    )
  }
  return (
    <RxPageCore {...other} style={style} navBar={navBar()}>
      {children}
    </RxPageCore>
  )
}

RxPage.prototype = PPC.page.prototype
RxPage.defaultProps = PPC.page.defaultProps
export default RxPage
